import Head from 'next/head';
import CellInstanceAPIsTable from '../../../components/prop-tables/CellInstanceAPIsTable';
import SourceCode from '../../../components/prop-tables/CellInstanceAPIsSource';
import OptionsSwitcher from '../../../example-groups/OptionsSwitcher';

<Head>
  <title>{'Cell Instance APIs - Material React Table V3 Docs'}</title>
  <meta
    name="description"
    content="All the cell instance methods and objects that can be accessed from a cell in Material React Table"
  />
  <meta
    property="og:title"
    content="Material React Table Cell Instance API Reference"
  />
  <meta
    property="og:description"
    content="A reference of all the cell instance api methods and objects that can be used in Material React Table"
  />
</Head>

## Cell Instance APIs

<OptionsSwitcher
  links={[
    {
      label: 'Table Instance APIs',
      value: 'table-instance-apis',
    },
    {
      label: 'Column Instance APIs',
      value: 'column-instance-apis',
    },
    {
      label: 'Row Instance APIs',
      value: 'row-instance-apis',
    },
    {
      label: 'Cell Instance APIs',
      value: 'cell-instance-apis',
    },
  ]}
/>

<br />

Every cell provides a `cell` object that can be used in many props or column definitions that let's you have access to a cell's information and methods.

You can access and use a `cell` object in quite a few places, but here are some of the most common:

```jsx
const columns = [
  {
    accessorKey: 'username',
    header: 'Username',
    //you can access a cell in many callback column definition options like this
    muiTableBodyCellProps: ({ cell }) => ({
      onClick: () => {
        console.log(cell.getValue(), cell.id);
      },
    }),
    //or in the component override callbacks like this
    Cell: ({ cell }) => {
      return <div>{cell.getValue()}</div>;
    },
  },
];

const table = useMaterialReactTable({
  columns,
  data,
  //or in callback props like this
  muiEditTextFieldProps: ({ cell }) => ({
    disabled: cell.getValue() === 'admin',
  }),
});
```

> NOTE: These are NOT [props](/docs/api/props) or [column options](/docs/api/column-options) for Material React Table. These are just static methods on a cell instance that you can use.

<CellInstanceAPIsTable />

<SourceCode />
